<template>
   <view class="topclassify">
	   <view class="topList">
		   <image src="/static/img/1/61.png" mode="scaleToFill"></image>
		   <view class="desc">
			   <view class="name"><image src="/static/img/2/2-29.png" mode="aspectFit"></image>1000+<image src="/static/img/2/2-14.png" mode="aspectFit" class="rig"></image>好评率98%</view>
			  
			   <navigator url="../brand/detial" class="btn">共<text class="red">100</text>件商品<text class="yticon icon-you"></text></navigator>
			  
		   </view>
	   </view>
	  <view class="topList">
	  		   <image src="/static/img/1/61.png" mode="scaleToFill"></image>
	  		   <view class="desc">
	  			   <view class="name"><image src="/static/img/2/2-29.png" mode="aspectFit"></image>1000+<image src="/static/img/2/2-14.png" mode="aspectFit" class="rig"></image>好评率98%</view>
	  			  
	  			   <view class="btn">共<text class="red">100</text>件商品<text class="yticon icon-you"></text></view>
	  			  
	  		   </view>
	  </view>
	  <view class="topList">
	  		   <image src="/static/img/1/61.png" mode="scaleToFill"></image>
	  		   <view class="desc">
	  			   <view class="name"><image src="/static/img/2/2-29.png" mode="aspectFit"></image>1000+<image src="/static/img/2/2-14.png" mode="aspectFit" class="rig"></image>好评率98%</view>
	  			  
	  			   <view class="btn">共<text class="red">100</text>件商品<text class="yticon icon-you"></text></view>
	  			  
	  		   </view>
	  </view>
	  <view class="topList">
	  		   <image src="/static/img/1/61.png" mode="scaleToFill"></image>
	  		   <view class="desc">
	  			   <view class="name"><image src="/static/img/2/2-29.png" mode="aspectFit"></image>1000+<image src="/static/img/2/2-14.png" mode="aspectFit" class="rig"></image>好评率98%</view>
	  			  
	  			   <view class="btn">共<text class="red">100</text>件商品<text class="yticon icon-you"></text></view>
	  			  
	  		   </view>
	  </view>
	  
	   
	   
	   <!-- 分享 -->
	   <share 
	   	ref="share" 
	   	:contentHeight="900"
	   	:shareList="shareList"
	   ></share>
   </view>
</template>

<script>
	import share from '@/components/share';
    export default {
        name: "",
        components:{
            share
        },
        data(){
            return {
                shareList: []
            }
        },
		async onLoad(){
			
		
			this.shareList = await this.$api.json('shareList');
		},
		onNavigationBarButtonTap(e) {
			// console.log(e)
			
			this.$refs.share.toggleMask();
			
				
		}
      

    }
</script>

<style lang="scss">
	page{
		background: #f5f5f5;
	}
	.topclassify{
		.topList{
			position: relative;
			margin-bottom: 22upx;
			background: #fff;
			image{
				width: 100%;
				height: 449upx;
			}
			.desc{
				padding: 35upx 21upx;
				font-size:23upx;
				font-family:Microsoft YaHei;
				font-weight:400;
				color:rgba(102,102,102,1);
				background: #fff;
				display: flex;
				align-items: center;
				justify-content: space-between;
				
				image{
					width:25upx;
					height:22upx;
					margin-right: 10upx;
				}
				.name{
					display: flex;
					align-items: center;
				}
				.btn{
					font-size:23upx;
					font-family:Adobe Heiti Std;
					font-weight:normal;
					color:rgba(153,153,153,1);
					display: flex;
					align-items: center;
					.red{
						color: #F0406F;
						margin: 0 5upx;
					}
				}
				.rig{
					margin-left: 30upx;
				}
				
			}
			
			
			
		}
		
		
	}
</style>
